<template>
  <div>
    <el-form class="query-table-form" @submit.native.prevent :inline="true" :model="params">
      <el-form-item>
        <select-address
          v-model="params.address_code"
          :auto-top="true"
          placeholder="地址查询"
          clearable
          @change="getData()"
        ></select-address>
      </el-form-item>
      <el-form-item>
        <el-input
          v-model="params.customer_name"
          placeholder="企业名称查询"
          :clearable="true"
          @change="getData()"
        ></el-input>
      </el-form-item>
      <el-form-item>
        <el-input
          v-model="params.lender_idcard"
          placeholder="身份证号码查询"
          :clearable="true"
          @change="getData()"
        ></el-input>
      </el-form-item>
      <el-form-item>
        <el-input
          v-model="params.contact_person"
          placeholder="经营者名称查询"
          :clearable="true"
          @change="getData()"
        ></el-input>
      </el-form-item>
      <el-form-item>
        <el-button icon="el-icon-search" @click="getData()">查询</el-button>
      </el-form-item>
    </el-form>
    <c-table border class="table-sm" v-loading="loading" :columns="tableColumns" :data="tableData">
      <template v-slot:address="scope">
        <div class="text-truncate" :title="scope.row.address">{{ scope.row.address }}</div>
      </template>
    </c-table>
    <div class="query-pagination">
      <div></div>
      <el-pagination
        layout="total, prev, pager, next, jumper"
        :current-page.sync="params.index"
        :page-size="params.size"
        :total="tableCount"
        @current-change="getData"
      ></el-pagination>
    </div>

    <el-dialog
      :visible.sync="reportVisible"
      :close-on-click-modal="false"
      append-to-body
      top="30px"
      width="80%"
    >
      <credit-file
        :view-mode="viewMode"
        :credit-type="creditType"
        :query-id="queryId"
      ></credit-file>
    </el-dialog>
  </div>
</template>

<script>
import CreditFile from '@/credit/components/creditFile/Index'
import { enumFarmType } from '@/credit/plugins/enum'
import { enumClaimStatus } from '@/bank/plugins/enum'
import { ONE_INDUSTRY_LOAD_PRODUCT } from '@/credit/plugins/constant'
import SelectAddress from '@/components/select/SelectAddress'
export default {
  components: {
    CreditFile,
    SelectAddress,
  },
  props: {
    receive: {
      type: Boolean,
      default: false,
    },
    regetData: {
      type: Boolean,
      default: false,
    },
  },
  data() {
    return {
      loading: false,
      tableColumns: [
        {
          attrs: { label: '主体名称', prop: 'customer_name', minWidth: '120px' },
          process: (v, row) => ({
            attrs: { class: 'project-history', attrs: { 'data-history': row.is_history } },
          }),
        },
        { attrs: { label: '地址', prop: 'address' }, slot: 'address' },
        {
          attrs: { label: '企业类型', prop: 'farm_type', align: 'center' },
          process: v => enumFarmType[v] || '-',
        },
        { attrs: { label: '经营者姓名', prop: 'contact_person', align: 'center' } },
        { attrs: { label: '联系电话', prop: 'mobile_no', align: 'center' } },
        { attrs: { label: '预审金额', prop: 'approved_funds', align: 'center' } },
        {
          attrs: { label: '认领状态', prop: 'claim_status', align: 'center' },
          process: v => enumClaimStatus[v] || '-',
        },
        {
          attrs: { label: '认领时间', prop: 'claim_time', align: 'center' },
          process: v => this.$utils.dateFormat(v, 'yyyy.MM.dd') || '-',
        },
        { attrs: { label: '备注', prop: 'remark', align: 'center' } },
        {
          attrs: { label: '操作', align: 'center' },
          operations: [
            {
              content: '认领',
              icon: 'fa fa-check',
              event: this.handleToDetail,
              ifRender: row => !this.receive && +row.claim_status === 0,
            },
            { content: '数字信用档案', icon: 'fa fa-file-text', event: this.handleView },
          ],
        },
      ],
      tableData: [],
      tableCount: 0,
      params: {
        index: 1,
        size: 20,
        public_bank_ids: '',
      },
      viewMode: false,
      queryId: '',
      reportVisible: false,
      creditType: 'base',
    }
  },
  computed: {
    clientId() {
      return this.$store.getters.clientId
    },
  },
  watch: {
    regetData() {
      if (this.receive) {
        this.getData()
      }
    },
  },
  created() {
    this.params['loan_product_id.neq'] = ONE_INDUSTRY_LOAD_PRODUCT
    this.getData()
  },
  methods: {
    handleView(row) {
      this.viewMode = true
      this.queryId = row.customer_related_id
      this.reportVisible = true
    },
    async getData(index = 1) {
      this.params.index = index
      if (this.receive) {
        this.creditType = 'intact'
        this.params.public_bank_ids = ''
        this.params['bank_id.eq'] = this.clientId
      } else {
        this.creditType = 'base'
        this.params.public_bank_ids = this.clientId
        this.params['orWhere.bank_id.is'] = 'null'
        this.params['orWhere.bank_id.neq'] = this.clientId
        this.params['bank_census.neq'] = '3'
      }
      this.loading = true
      const [res] = await this.$utils.promise(
        this.$api.getData(this.$serviceName, 'customer_related_view', this.params, {
          N1claim_status: 'asc',
          N1claim_time: 'desc',
        })
      )
      const data = (res && res.data) || {}
      this.tableCount = data.totalCount
      this.tableData = data.data
      this.loading = false
    },
    handleToDetail(row) {
      this.$confirm('确定认领该任务?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
      }).then(() => {
        const url = `"customer_related.customer_related_id".eq(${row.customer_related_id})&"customer_related.bank_id".is(null)`
        const data = {
          bank_id: this.clientId,
          claim_time: this.$utils.dateFormat(new Date()),
          remark: '银行处理中',
          claim_status: '1',
        }
        this.axios
          .put(
            `/api/${this.$serviceName}/customer_related/where/?where=${encodeURIComponent(url)}`,
            data
          )
          .then(res => {
            this.getData()
            if (res.data) {
              this.$emit('success', true)
              this.$message.success('认领成功！')
            } else {
              this.$message.warning(`认领失败请重试！！`)
            }
          })
          .catch(err => {
            return this.$message.warning(`认领失败请重试！！${err.status}`)
          })
      })
    },
  },
}
</script>

<style scoped></style>
